<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>类的基本知识</title>
  </head>
  <body>
    <script>
      // 创建一个 Person 类
      class Person {
        // 构造器方法
        constructor(name, age) {
          // 构造器中的 this 指向当前的实例对象
          console.log(this)
          this.name = name
          this.age = age
        }

        // 非构造器方法皆为一般方法，皆放在原型链上
        // 备注：谁调用它 this 就指向谁
        speak() {
          console.log('speak', this.name, this.age)
        }
      }

      // 创建一个 Student 类，继承 Person 类
      // 注意：
      // 1. 子类会自动继承父类 constructor，方法
      // 2. 如果子类写 constructor，则必须要写 super(...argu)，且放在行首
      class Student extends Person {
        constructor(name, age, grade) {
          super(name, age)
          this.grade = grade
        }

        study() {
          console.log('study-->this', this)
          console.log('我在学习')
        }
      }

      // 创建一个 Person 类的实例
      const P1 = new Person('张三', 18)
      const P2 = new Person('李四', 18)
      const S1 = new Student('王五', 18, '一年级')

      console.log(P1)
      console.log(P2)
      console.log(P2 instanceof Person)
      console.log(P1.speak())
      console.log(S1)
      console.log('2', S1.speak()) // 这里会打印两个 console.log，一个是父类的（有值），一个是子类的（undefined）
      S1.study()
    </script>
  </body>
</html>
